<template>
    <div>
        <el-card
            class="mt-2"
            shadow="never"
            v-for="(item, index) in review"
            :key="index"
        >
            <el-form label-width="105px" label-position="right">
                <el-form-item :label="`${item.user_name}审核`">
                    <div class="flex-box">
                        <span style="color: #70c546">{{ item.summary }}</span>
                        <span>审核时间 {{ item.create_time }}</span>
                    </div>
                </el-form-item>
                <el-form-item label="审核意见" v-if="item.remark">
                    {{ item.remark }}
                </el-form-item>
            </el-form>
        </el-card>
        <el-card class="mt-2" shadow="never" v-if="show">
            <el-form
                :model="formObj"
                label-width="105px"
                label-position="right"
            >
                <el-form-item label="审核意见">
                    <el-input
                        v-model="formObj.summary"
                        type="textarea"
                        placeholder="请输入审核意见"
                        :autosize="{ minRows: 4 }"
                        size="small"
                    ></el-input>
                </el-form-item>
            </el-form>
        </el-card>
    </div>
</template>

<script setup lang="ts">
const props = defineProps(["review", "show"]);
const formObj = ref({ summary: "" });
defineExpose({ formObj });
</script>

<style lang="scss" scoped>
.el-form-item {
    margin-bottom: 0;
}

::v-deep .el-form-item__label {
    border-left: 0;
    border-top: 0;
    border-bottom: 0;
}
.flex-box {
    padding-right: 50px;
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
</style>
